<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link href="/static/CSS/index.css" type="text/css" rel="stylesheet">
    <title>UWP</title>
    <basetarget="_parent" />
    <!-- bootstrap -->
    <link href="/static/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet"/>
    <!-- 引入jqury,bootsrapt都依赖jqury，必须放在前面 -->
    <script type="text/javascript" src="/static/js/jquery-3.3.1.min.js"></script>
    <!-- 引入cookie -->
    <script type="text/javascript" src="/static/js/jquery.cookie.js"></script>
    <!-- 引入js -->
    <script type="text/javascript" src="/static/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
</head>

<body>

<iframe class="header" src="header.html"></iframe>
<div class="container-fluid ">
    <div class="row" style="height: 280px;">
        <!-- LMP图标 -->
        <div class="col-md-4 col-md-offset-3" style="width:100%;
				height:280px;
				top:50px;
				background:url('../images/login_bg.png') no-repeat;
				background-size: 30% 50%;
				">

        </div>
        <!-- 企鹅 -->
        <div class="col-md-4 col-md-offset-7" style="height:280px;
							top:-280px;
							background:url('../images/index_bg.jpg') no-repeat;
							background-position:50% ;
							background-size:60% 100%;">

        </div>
    </div>
    <!-- 复选框表单 -->
    <div class="row" style="margin-top:-480px;">
        <div class="col-md-7 col-md-offset-3 main">
            <label class="checkbox-inline">
                <input type="checkbox" id="Cb_cpu" value="cpuutilize"> cpuutilize
            </label>
            <label class="checkbox-inline">
                <input type="checkbox" id="Cb_irq" value="irq"> irq
            </label>
            <label class="checkbox-inline">
                <input type="checkbox" id="Cb_pic" value="picknext"> picknext
            </label>
            <label class="checkbox-inline">
                <input type="checkbox" id="Cb_task" value="taskswitch"> taskswitch
            </label>
            <label class="checkbox-inline">
                <input type="checkbox" id="Cb_hard" value="harddiskreadwritetime"> harddiskreadwritetime
            </label>
            <label class="checkbox-inline">
                <input type="checkbox" id="Cb_memusage" value="memusage"> memusage
            </label>
            <label class="checkbox-inline">
                <input type="checkbox" id="Cb_collect" value="collecttime"> collecttime
                <!-- 输入框,监听CheckBox，未选择不可用 -->
                <input type="text" id="input_collect" placeholder="提取时间" size="10px">
            </label>
            <div class="row" style="top:10px">
                <div class="col-md-3 col-md-offset-6">
                    <button type="button" id="btn_submmit" class="btn btn-default">Submmit</button>
                </div>
            </div>
        </div>

    </div>


</div>
</div>
<iframe class="footer" src="footer.html"></iframe>

<script type="text/javascript">


    //如果未登录，不允许打开index自动转到login



    function chekcCollect() {
        if (!$("#Cb_collect").is(":checked")) {
            //加一个禁用属性 ---
            $("#input_collect").attr("disabled", "disabled");

        }
    }
    chekcCollect();
    //选中启用
    $("#Cb_collect").click(function () {
        if (!$("#Cb_collect").is(":checked")) {
            $("#input_collect").attr("disabled", "disabled");
        }
        if ($("#Cb_collect").is(":checked")) {
            $("#input_collect").removeAttr("disabled");
        }

    });
    //提交
    var url = 'http://121.41.228.3:8080';
    $("#btn_submmit").click(function () {
        //type选择器 : $(":checkbox")
        //默认只提交一个
        var value = "";
        $(":checkbox").each(function () {
            if ($(this).is(":checked")) {
                value = $(this).val();
            }

        });
        // 从cookies里面取token
        var token = $.cookie("token");
        //遍历复选框，选中的值提交ajax
        $.ajax({
            url: url + "/data/collect",
            type: "post",
            header:{token:token},
            contentType: "application/json",
            data:JSON.stringify({value:value}),
            success: function (result) {
                //访问成功就跳转
                var msg = result.msg;

                if (result.code==200) {
                    //操作 跳转
                    window.location.replace("");
                }else{
                    alert(msg);
                }
            }
        });
    });
</script>
</body>

</html>
